<!-- 开通商户 -->
<template>
	<view class="open-merchants">
		<view class="steps">
			<steps
				:list="data.steps"
				:active="data.stepIndex"
				size="48"
				lineScale="70"
				activePointColor="#E1835B"
				activeLineColor="#E1835B"
				activeTextColor="#222"
				activeDescColor="#aaa"
			/>
		</view>
		<view>
			<view class="hd" v-if="data.stepIndex === 0">
				<text>请先确认，您正在使用以下认证信息身份的账号开通本系统。点击“下一 步”则表示您确认无误</text>
				<text class="question-tips" @click="questionTips">信息有误？</text>
			</view>
			<view class="hd" v-if="data.stepIndex === 1">
				<text>温馨提示：设置合适、合法合规的信息，有利于建立良好的商户形象、提高客户对您的专业认可。</text>
				<text class="tips">请务必按要求设置，否则将审核失败！</text>
			</view>
			<view class="hd" v-if="data.stepIndex === 2">
				<text>服务信息越准确，客户越精准！主要用于匹配并将您展示给有对应需求的客户</text>
				<navigator class="question-tips" :url="agreementUrl">服务信息展示说明</navigator>
				<text class="question-tips" @click="questionTips">填写遇到问题</text>
			</view>

			<person-msg
				v-if="data.stepIndex === 0 && data.authType === 1 && data.isOK"
				:baseData="data.baseMsgData"
				ref="personMsgRef"
				@personMsgCallback="personMsgCallback"
			></person-msg>
			<mechanism-msg
				v-if="data.stepIndex === 0 && data.authType === 2 && data.isOK"
				:baseData="data.baseMsgData"
				ref="mechanismMsgRef"
				@mechanismMsgCallback="mechanismMsgCallback"
			></mechanism-msg>
			<base-msg v-if="data.stepIndex === 1" ref="baseMsgRef" @baseMsgCallback="baseMsgCallback"></base-msg>
			<server-msg v-if="data.stepIndex === 2 && data.isOK" :dataSubData="data.subData" :baseData="data.baseMsgData" ref="baseMsgRef"></server-msg>
		</view>
	</view>
</template>

<script setup>
import { ref, reactive, defineComponent,computed } from 'vue';
import config from '@/uni.config.js';
import useStatus from '@/common/hooks/useStatus.js';
import { showModal, showCopy } from '@/common/hooks/useShow.js';
import { activateNow } from '@/subpages/common/api/open.js';

import personMsg from '../open/components/person-msg.vue';
import mechanismMsg from '../open/components/mechanism-msg.vue';
import baseMsg from '../open/components/base-msg.vue';
import serverMsg from '../open/components/server-msg.vue';

const personMsgRef = ref(null);
const mechanismMsgRef = ref(null);
const baseMsgRef = ref(null);
const serverMsgRef = ref(null);

defineComponent({
	personMsg,
	mechanismMsg,
	baseMsg,
	serverMsg
});

const data = reactive({
	authType: null,
	stepIndex: 0,
	subData: {},
	baseMsgData: {},
	isOK: false,
	steps: [
		{
			name: '身份确认',
			value: 1,
			desc: ''
		},
		{
			name: '基本信息',
			value: 2,
			desc: ''
		},
		{
			name: '服务信息',
			value: 3,
			desc: ''
		}
	]
});

const agreementUrl = computed(() => {
	return `/subpages/web/web?url=${encodeURIComponent(config.article.serverInfo)}`
});

function init() {
	activateNowRequest();
}
init();
//开通鉴权
async function activateNowRequest() {
	const res = await activateNow();
	//200满足开通 -201 不满足开通条件 -202未认证或者失败 -203 审核中
	data.baseMsgData = res.data;
	data.authType = res.data.type;
	data.isOK = true;
	// showModalType('请求失败请稍后再试', '知道了', false);
	// showModalType(`您当前不满足开通条件，如有疑问请联系管理员QQ：${config.customer.admin}`, '我知道了', false, config.customer.admin);
	// showModalType('当前账号未认证或认证失败，请先认证', '立即认证', true);
	// showModalType(`当前账号认证审核中，请等待认证审核通过后再开通进QQ群了解更多：${config.customer.qq_group}`, '我知道了', false, config.customer.qq_group);
	switch (res.code) {
		case -200:
			showModalType(res.message, '我知道了', false);
			break;
		case -201:
			showModalType(`您当前不满足开通条件，如有疑问请联系管理员QQ：${config.customer.admin}`, '我知道了', false);
			break;
		case -202:
			showModalType('当前账号未认证或认证失败，请先认证', '立即认证', true);
			break;
		case -203:
			showModalType(`当前账号认证审核中，请等待认证审核通过后再开通进QQ群了解更多：${config.customer.qq_group}`, '我知道了', false);
			break;
		default:
			break;
	}
}
//开通权限不足弹窗
function showModalType(content, confirmText, type) {
	showModal({
		title: '提示',
		content: content,
		confirmText: confirmText,
		showCancel: type,
		confirm() {
			if (type) {
				uni.$emit('GOAUTH');
			}
			uni.navigateBack();
		},
		cancel() {
			uni.navigateBack();
		}
	});
}
//消息有误弹窗提示
function questionTips() {
	showModal({
		title: '提示',
		content: `联系工作人员QQ：${config.customer.qq_operate}`,
		confirmText: '我知道了',
		cancelText:'复制QQ',
		cancel() {
			showCopy({
				data: config.customer.qq_operate,
				type: 1,
				icon: 'none',
				title: 'QQ号已复制'
			});
		}
	});
}
function personMsgCallback(callbackData) {
	data.stepIndex = callbackData.stepIndex;
	data.subData.agreement = callbackData.agreement;
}
function mechanismMsgCallback(callbackData) {
	data.stepIndex = callbackData;
}
function baseMsgCallback(callbackData) {
	data.stepIndex = callbackData.stepIndex;
	data.subData = { ...data.subData, ...callbackData.subData };
}
</script>

<style lang="scss">
@import '@/common/css/base.scss';
page {
	background-color: $bgColor;
}
</style>
<style scoped lang="scss">
@import '@/common/css/base.scss';
@import '@/common/css/form.scss';
.open-merchants {
	.steps {
		padding: 40rpx 0;
		background-color: #fff;
	}
	.hd {
		padding: 24rpx 32rpx;
		color: #e1835b;
		line-height: 40rpx;
		font-size: 24rpx;
		background: #fff5e5;
		.tips {
			color: #ff0000;
		}
		.question-tips {
			display: inline-block;
			margin-left: 16rpx;
			text-decoration: underline;
		}
	}
}
</style>
